/* 禁用iPhone中Safari的字号自动调整 */
html {-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;}

/* 去除iPhone中默认的input样式 */
input[type="submit"], input[type="reset"], input[type="button"], input {-webkit-appearance: none;resize: none;}

/* 取消链接高亮  */
body, div, ul, li, ol, h1, h2, h3, h4, h5, h6, input, textarea, select, p, dl, dt, dd, a, img, button, form, table, th, tr, td, tbody, article, aside, details, figcaption, figure, footer, header, menu, nav, section {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* 设置HTML5元素为块 */
article, aside, details, figcaption, figure, footer, header, menu, nav, section {display: block;}

/* 图片自适应 */
img {width: 100%;height: auto;      
	width: auto\9; /* ie8 */ 	-ms-interpolation-mode: bicubic;  /b   *为了照顾ie图片缩放失真*/}

/* 初始化 */
body, div, ul, li, ol, h1, h2, h3, h4, h5, h6, input, textarea, select, p, dl, dt, dd, a, img, button, form, table, th, tr, td, tbody, article, aside, details, figcaption, figure, footer, header, menu, nav, section {
	margin: 0;padding: 0;border: none;
}
body {background-color: #F7F7F7;}
em, i {font-style: normal;}
strong {font-weight: normal;}
.clearfix:after {
	content: "";
	display: block;
	visibility: hidden;
	height: 0;
	clear: both;
}
.clearfix {
	zoom: 1;
}
a {
	text-decoration: none;
	color: #2a2a2a;
	font-family: '宋体', Microsoft YaHei, Tahoma, Arial, sans-serif;
}
a:hover {
	color: #FED503;
	text-decoration: none;
}
ul, ol {
	list-style: none;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-family: Microsoft YaHei;
	font-weight: normal;
}
img {
	border: none;
}

/*让元素水平垂直居中*/
.center{position: absolute;top:50%;left: 50%;
    transform:translate(-50%,-50%)
}

/*让hr默认值清空*/
hr{    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    border:0;
}

html,body{width: 100%;height: 100%;}
html{font-size: 20px;min-width: 320px;max-width:640px;margin: 0 auto; }

/*单行文字超出显示省略号*/
.omg{overflow: hidden; text-overflow: ellipsis; white-space:nowrap;}
/*表格显示省略号*/
td{max-height: 32px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap!important;}

/*placeholder浏览器默认颜色统一*/
::-webkit-input-placeholder { /* WebKit browsers */ 
color: #a7a7a7; } 
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
color: #a7a7a7; } 
::-moz-placeholder { /* Mozilla Firefox 19+ */ 
color: #a7a7a7; } 
:-ms-input-placeholder { /* Internet Explorer 10+ */ 
color: #a7a7a7; } 

.none{ display:none;}
.fl{float:left;}
.fr{float: right;}
.box-sizing{box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;}
/*防止浏览器自动填充*/
.tcinput{position: absolute;top: -999px;}

/*颜色*/
.global-primary{color:#0e90d2;}
.global-success{color:#5eb95e;}
.global-warning{color:#F37B1D;}
.global-danger{color:#dd514c;}


/*字符loading实现  代码：<dot>...</dot>*/
dot {
    display: inline-block; 
    height: 1em; line-height: 1;
    text-align: left;
    vertical-align: -.25em;
    overflow: hidden;
}
dot::before {
    display: block;
    content: '...\A..\A.';
    white-space: pre-wrap;   /* 也可以是white-space: pre */
    animation: dot 3s infinite step-start both;
}
@keyframes dot {
    33% { transform: translateY(-2em); }
    66% { transform: translateY(-1em); }
}


/*基于rem和vm和calc实践代码*/
html {
    font-size: 16px;
}

@media screen and (min-width: 375px) {
    html {
        /* iPhone6的375px尺寸作为16px基准，414px正好18px大小, 600 20px */
        font-size: calc(100% + 2 * (100vw - 375px) / 39);
        font-size: calc(16px + 2 * (100vw - 375px) / 39);
    }
}
@media screen and (min-width: 414px) {
    html {
        /* 414px-1000px每100像素宽字体增加1px(18px-22px) */
        font-size: calc(112.5% + 4 * (100vw - 414px) / 586);
        font-size: calc(18px + 4 * (100vw - 414px) / 586);
    }
}
@media screen and (min-width: 600px) {
    html {
        /* 600px-1000px每100像素宽字体增加1px(20px-24px) */
        font-size: calc(125% + 4 * (100vw - 600px) / 400);
        font-size: calc(20px + 4 * (100vw - 600px) / 400);
    }
}
@media screen and (min-width: 1000px) {
    html {
        /* 1000px往后是每100像素0.5px增加 */
        font-size: calc(137.5% + 6 * (100vw - 1000px) / 1000);
        font-size: calc(22px + 6 * (100vw - 1000px) / 1000);
    }
}


/*UI元素*/
.button {  
    display: inline-block;  
    zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */  
    *display: inline;  
    vertical-align: baseline;  
    margin: 0 2px;  
    outline: none;  
    cursor: pointer;  
    text-align: center;  
    text-decoration: none;  
    padding: .5em 2em .55em;  
    text-shadow: 0 1px 1px rgba(0,0,0,.3);  
    -webkit-border-radius: .5em;   
    -moz-border-radius: .5em;  
    border-radius: .5em;  
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);  
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);  
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    color: #fff;
}  
.button:hover {  
    text-decoration: none;  
}  
.button:active {  
    position: relative;  
    top: 1px;  
}  

.medium {  
    font-size: 12px;  
    padding: .4em 1.5em .42em;  
}  
.small {  
    font-size: 12px;  
    padding: .1em 1.5em .275em;  
} 

/*input*/
.form-control:focus {
    border-color: #aad2fb;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(147,161,187,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(147,161,187,.6);
}

.form-control {
    width: 150px;
    height: 28px;
    box-sizing: border-box;
    padding: 6px 12px;
    background-color: #fff;
    border: 1px solid #c2cad8;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    outline: 0!important;
    box-shadow: none;
}
.form-control, output {
    font-size: 14px;
    line-height: 1.42857;
    color: #4d6b8a;
    display: inline-block;
}
